<template>
  <div class="bigbox">
    <div class="head">
      发表评论
    </div>
    <div class="bod">
      <p class="p">评价：</p>
      <el-rate v-model="value3" show-text></el-rate>
      <p class="p p2">图片评论：</p>
      <!-- :on-preview="handlePictureCardPreview" -->
      <!-- http://mountainfreshes.cdsok.com.cn/index/ajax/upload -->
      <el-upload

        action="http://www.mountainfreshes.com/index.php/index/ajax/upload"
        list-type="picture-card"
        :on-preview="handlePictureCardPreview"
        :on-remove="handleRemove"
        :on-success="sss"
        >
        <i class="el-icon-plus"></i>
      </el-upload>
      <el-dialog :visible.sync="dialogVisible">
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
      <p class="p p2">文字描述：</p>
      <textarea name="txt" v-model="txt"></textarea>
      <div style="width: 100%;text-align: center;margin-top: 20px;">
        <el-button @click="tj()" type="primary" size="mini">提交评论</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import cp1 from '@/assets/image/cp1.jpg';
import qs from "qs"
import store from '@/vuex/store'
export default {
  name: 'App',
  data(){
    return{
      cp1,
      value3:0,
      dialogImageUrl: '',
      dialogVisible: false,
      txt:'',
      imgstring:''
    }
  },
  methods:{
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    sss:function(fileList){
      
      this.imgstring = this.imgstring+','+fileList
      console.log(this.imgstring)
    },
    tj:function(){
      this.$http.post("/index.php/user/content/add_content",qs.stringify({
              // mobile:this.tel,
              // password:this.pwd
                  user_id: this.$store.state.userid,
                  content: this.txt,
                  star: this.value3,
                  good_id: this.$route.query.iid,
                  img: this.imgstring,
                  order_number: this.$route.query.ordernum
              }))
              .then(res => {
                console.log(res)
                this.imgstring = ''
                this.value3 = 0
                this.txt = ''
                this.dialogImageUrl = ''
                this.$router.push({ path: '/person/order/all-order' })
              })
              .catch(error => {
                alert("网络错误")
              });
    }
  },
  components:{
    
  }
}
</script>

<style scoped lang="less">
.bigbox{
  width: 100%;
  height: auto;
  zoom: 1;
  overflow: hidden;
  .head{
    width: 100%;
    height: 42px;
    box-sizing: border-box;
    border: 1px solid #a5a5a5;
    background: #f2f2f2;
    text-indent: 48px;
    line-height: 40px;
    font-size: 16px;
    color: #232323;
  }
  .bod{
    width: 100%;
    height: auto;
    zoom: 1;
    overflow: hidden;
    margin-top: 12px;
    box-sizing: border-box;
    border: 1px solid #b5b5b5;
    padding: 30px;
    .p{
      font-size: 16px;
      color: #212121;
      padding-bottom: 8px;
    }
    .p2{
      padding-top: 20px;
    }
    textarea{
      display: block;
      width: 100%;
      height: 120px;
      resize: none;
      font-size: 14px;
      color: #212121;
      line-height: 30px;
      font-family:'weiruanyahei';
      text-indent: 10px;
    }

  }
}
</style>
